<!-- 业务派单 - 我的待办 - 基本信息 -->
<template>
  <el-container class="businessSendList">
    <el-main class="mainDetails">
      <div>
        <SearchPanel title="查询条件">
          <div ref="queryFormBox" class="search-flex-box">
            <MyForm
              ref="formRef"
              v-model="queryParams"
              :form-option="formOption"
              :select-list="dicLists"
              class="myForm"
            />
            <div class="searchBtn">
              <el-button type="primary" class="pms-button-primary" @click="doSearch">查询</el-button>
              <el-button class="pms-button-primary" size="small" @click="dialogCheckbox = true">
                自定义列
              </el-button>
            </div>
          </div>
        </SearchPanel>
        <SearchList title="查询结果" style="margin-top: 16px">
          <template #header-btn>
            <BtnConfig ref="btnConfigRef" :btn-configs="btnOption" @propClick="btnClick" />
          </template>
          <template #body>
            <MyTable
              id="prjId"
              ref="myTableRef"
              :table-data="tableData"
              :columns="colOption"
              :col-option-enum="dicLists"
              :is-selection="false"
            >
              <template #prjName="{ scope }">
                <div type="text">{{ scope.prjName }}</div>
              </template>
              <template #processingProgress="{ scope }">
                <div type="text">{{ showProce(scope.processingProgress) }}</div>
              </template>
              <template #handlingTime="{ scope }">
                <div type="text" :style="{'color':showColor(scope)}">{{ scope.handlingTime + '天' }}</div>
              </template>
            </MyTable>
            <pagination
              v-if="pageParam.total > 10"
              :total="pageParam.total"
              :page.sync="pageParam.pageNum"
              :limit.sync="pageParam.pageSize"
              @pagination="doSearch"
            />
          </template>
        </SearchList>
        <el-dialog
          v-dialogDrag
          title="列表字段配置"
          width="50%"
          :append-to-body="true"
          :modal-append-to-body="true"
          :modal="true"
          :close-on-click-modal="false"
          :lock-scroll="true"
          class="pms-dialog"
          :visible.sync="dialogCheckbox"
        >
          <div class="dialogCheckbox">
            <SetDynamics ref="customRef" :fixed-check-option="fixedCheckOption" :custom-check-option="customCheckOption" />
          </div>
          <div slot="footer" class="dialog-footer">
            <el-button class="pms-button-primary" size="small" @click="activeCustomCheck">确 定</el-button>
            <el-button class="pms-button-primary" size="small" @click="dialogCheckbox = false">取消</el-button>
          </div>
        </el-dialog>
      </div>
    </el-main>
  </el-container>
</template>

<script>
import MyForm from '@/components/basic/myForm'
import SearchPanel from '@/components/basic/SearchPanel'
import SearchList from '@/components/basic/SearchList'
import MyTable from '@/components/basic/myTable'
import SysConst from '@/common/const'
import SetDynamics from '@/components/basic/setDynamics.vue'
import BtnConfig from '@/components/basic/btnConfig.vue'
import { getDropdownData } from '@/api/common' // 字典接口
import { getTDispatchList, dispatchAsyncExport } from '@/api/businessOperation/index' // 列表接口
import { getPrjStageApi } from '@/api/attachmentInfo'
import { transferTokenPost } from '@/api/businessOperation/index' // 列表接口
import { getQueryObject } from '@/utils' // 获取url地址信息
import {
    formOption,
    colOption, pressStateArr,
    customCheckOption, btnOption

} from '.'
export default {
  name: 'DispacthManage',
    components: {
        // HeaderTitle,
        MyForm,
        SearchPanel,
        SearchList,
        MyTable,
        BtnConfig,
        SetDynamics
      },
      data() {
        return {
            formOption, // 查询条件配置
            tableData: [], // 列表数据
            colOption, // 列表表头
            fixedCheckOption: colOption, // 固定字段
            customCheckOption, // 自定义字段
            btnOption, // 列表按钮
            queryParams: {
                deadline: new Date()
            }, // 查询条件
            dialogCheckbox: false, // 自定义列表弹框
            dicLists: {}, // 下拉框字典选项集合
            isOnly: '1', // 是否仅有基本字段，1-是，0-否 必需 用户选择自定义字段后需要传0，否则传1，默认传1
            // 分页信息
            pageParam: {
                pageSize: SysConst.PAGESIZE, // 每页显示val条
                pageNum: SysConst.CURRENT_PAGE, // 当前页
                total: SysConst.TOTAL // 总数
            }
        }
    },
    async created() {
        // 获取url
        const { acctId, pwdaToken } = getQueryObject()
          if (pwdaToken !== null && pwdaToken !== undefined && pwdaToken !== '') {
            var param = { acctId: acctId, token: pwdaToken }
            await transferTokenPost(param).then(res => {
                window.sessionStorage.setItem('china-tower-token-pms20', res.data)
            })
          }
        this.getPressStatus()
        this.getDictData()
        this.doSearch()
        this.getPrjStage()
    },
    methods: {
      showProce(proce) {
        const proceItem = pressStateArr.find(item => item.dictId === proce)
        return proceItem.dictName
      },
      showColor(row) {
            if (!row.timeoutState) {
                return ''
            }
            return row.timeoutState > 0 ? 'red' : ''
        },
      // 查看数据
      doSearch(item) {
            console.log(item, this.queryParams, 'fenye')
            const dispathcParam = {
              taskTitle: this.queryParams.taskTitle,
              prjName: this.queryParams.prjName,
              siteId: this.queryParams.siteId,
              siteName: this.queryParams.siteName,
              prjStage: this.queryParams.prjStage,
              sendName: this.queryParams.sendName,
              processingProgress: this.queryParams.processingProgress,
              startDeadline: Array.isArray(this.queryParams.deadlineArr) && this.queryParams.deadlineArr.length > 0 ? this.queryParams.deadlineArr[0] : null,
              endDeadline: Array.isArray(this.queryParams.deadlineArr) && this.queryParams.deadlineArr.length > 1 ? this.queryParams.deadlineArr[1] : null,
              sendCode: this.queryParams.sendCode,
              // sendMode: this.queryParams.sendMode,
              dispatchType: this.queryParams.dispatchType
            }
            const data = {
                pageNum: item?.page || SysConst.CURRENT_PAGE,
                pageSize: item?.limit || SysConst.PAGESIZE,
                isOnly: this.isOnly,
                param: dispathcParam
            }
            console.log(data, 'params')
            getTDispatchList(data).then(res => {
              if (+res.code !== 200) {
                  return Promise.reject(res)
        }
                this.tableData = res.data?.list
                this.pageParam.total = res.data?.total || 0
                this.pageParam.pageSize = item?.limit || SysConst.PAGESIZE
                this.pageParam.pageNum = item?.page || SysConst.CURRENT_PAGE
            })
        },
        // 点击跳转
        goPage(row) {
            console.log(row, 'row')
            // const page = this.$router.resolve({
            //     name: 'AttachmentDetails',
            //     query: {
            //         prjId: row.prjId
            //     }
            // })
            // window.open(page.href, '_blank')
        },
        // 重置
        // resetSearch() {
        //     this.$refs.formRef.reset()
        //     this.isOnly = '1'
        //     this.doSearch()
        // },
        // 自定义弹框-点击确认
        activeCustomCheck() {
            // const list = this.$refs.customRef.checkboxValue
            // if (list.length) {
            //     this.isOnly = '0'
            //     this.doSearch({
            //         page: this.pageParam.pageNum,
            //         limit: this.pageParam.pageSize
            //     })
            // }
            // this.colOption = [...colOption, ...list]
            // this.dialogCheckbox = false
        },
        // 查询建设单位
        // async queryOrg() {
        //     const res = await queryOrgApi()
        //     this.$set(this.dicLists, 'BUILD_UNIT', res.data ?? [])
        // },
        // 处理进度

        async getPressStatus() {
            this.$set(this.dicLists, 'PRESS_STATUS', pressStateArr ?? [])
        },
        // 获取项目阶段字典
        async getPrjStage() {
            const res = await getPrjStageApi()
            console.log(res, 'getPrjStage')
            const stageData = res.data.map(item => ({
                dictId: item.key,
                dictName: item.value
            }))
            this.$set(this.dicLists, 'PROJECT_STAGE', stageData)
        },
        // 获取下拉框数据
        async getDictData() {
            const arr = ['TDISPATCH_TYPE']
            const promises = arr.map(item => getDropdownData(item))
            const results = await Promise.all(promises)
            arr.forEach((item, i) => {
                this.$set(this.dicLists, item, results[i].data ?? [])
            })
        },
        // 列表按钮点击事件
        btnClick(fun, row) {
          this[fun](row)
        },
        // 导出
        async exportFun(row) {
            const dispathcParam = {
              taskTitle: this.queryParams.taskTitle,
              prjName: this.queryParams.prjName,
              siteId: this.queryParams.siteId,
              siteName: this.queryParams.siteName,
              prjStage: this.queryParams.prjStage,
              sendName: this.queryParams.sendName,
              processingProgress: this.queryParams.processingProgress,
              startDeadline: Array.isArray(this.queryParams.deadlineArr) && this.queryParams.deadlineArr.length > 0 ? this.queryParams.deadlineArr[0] : null,
              endDeadline: Array.isArray(this.queryParams.deadlineArr) && this.queryParams.deadlineArr.length > 1 ? this.queryParams.deadlineArr[1] : null,
              sendCode: this.queryParams.sendCode,
              // sendMode: this.queryParams.sendMode,
              dispatchType: this.queryParams.dispatchType
            }

          dispatchAsyncExport(dispathcParam).then(res => {
              if (+res.code !== 200) {
                  return Promise.reject(res)
              }
              this.$message.success(res.message)
          })
                // querySettPageListCount
      }
    }
}
</script>

<style lang="scss" scoped>
.businessSendList {
    width: 100%;
    .mainDetails {
        padding: 0 25px;
    }
    .customBtn {
        height: 20px;
        line-height: 20px;
        font-size: 14px;
        margin: 10px 20px 10px 90%;
        cursor: pointer;
        .el-icon-s-tools {
            font-size: 20px;
            color: #999;
            margin-right: 6px;
        }
    }
}
.search-flex-box {
    // display: flex;
    // justify-content: space-between;
    height: auto;
}
.searchBtn {
    width: 100px;
    margin-left: auto;
    display: flex;
    margin-top: 4px;
    flex-direction: column;
    .el-button + .el-button {
        margin-left: 0;
        margin-top: 8px;
    }
}

.el-button--text {
    color: #02A7F0;
}
.dialog-footer {
    display: flex;
    justify-content: center;
}
::v-deep .el-range-editor.el-input__inner {
  padding: 0px 10px;
}
</style>
